<template>
	<view>
		<navbar-bar :isback="true" text="完善信息"></navbar-bar>
		<base-form :formColumn="formColumn" v-model="formData" :rules="rules" errorType="none" ref="form">
			<template #aaa>
				aaaaa
			</template>
		</base-form>
		
		<u-button text="提交" shape="circle" type="primary" color="linear-gradient(to right bottom, #005ac2, #91B8E8)"
		 @click="submit"></u-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				formColumn:[
					{
						type:'slot',
						key:'aaa'
					},
					{
						label:'姓名',
						key:'name',
						type:'text',
						required:true,
						placeholder:'请输入姓名'
					},
					{
						label:'性别',
						key:'sex',
						type:'select',
						required:true,
						placeholder:'请选择性别',
						list: [
							[{
								label: '男',
								// 其他属性值
								id: '1'
							}, {
								label: '女',
								id: '2'
							}]
						],
						keyName:'label'
					},
					{
						label:'手机号',
						key:'tel',
						type:'text',
						required:true,
						placeholder:'请输入手机号',
					},
				],
				formData:{
					name:'',
					sex:'',
					tel:'',
				},
				rules:{
						'name': {
							type: 'string',
							required: true,
							message: '请输入姓名',
							trigger: ['blur', 'change']
						},
						'sex': {
							type: 'string',
							required: true,
							message: '请选择性别',
							trigger: ['blur', 'change']
						},
						'tel': {
							type: 'string',
							required: true,
							message: '请输入手机号',
							trigger: ['blur', 'change']
						},
					}
			}
		},
		methods: {
			async submit(){
				const flag = await this.$refs['form'].validate()
				console.log(flag)
				if(flag){
					
				}
			},
		}
	}
</script>

<style lang="less">
	page{
		height: calc(100vh -  constant(safe-area-inset-bottom) - 100rpx);
		height: calc(100vh -  env(safe-area-inset-bottom) - 100rpx);
	}
</style>